<template>
     <view class="thrumb mt-20 flex pd-20">
        <view style="width: 526rpx;">
            <scroll-view
        class="scroll-view_H"
        scroll-x="true"
        @scroll="scroll"
        scroll-left="0"
      >  
      <view class="flex">
        <view class="avtor" v-for="item in array" :key="item" >
            <image
          class="img"
          src="https://cdn.oss.bon-top.cn/static_bc/images/avtor.jpg"
        ></image> 
        <image
          class="img2"
          src="https://cdn.oss.bon-top.cn/static_bc/images/tumb.png"
        ></image> 
         </view>  
      </view>
        
      </scroll-view>   
        </view>
        <view class="ft flex-center c-66" style="width: 184rpx;"> {{array.length+'人点赞了' }}</view>
    </view>
</template>
<script setup lang="js">
import {ref} from 'vue';

const array =[1,2,3,4,5,6,7]
const  scroll=()=>{
    
}
</script>
<style lang="scss" scoped>
.thrumb{
    width: 690rpx;
height: 108rpx;
background: #F8F8F8;
border-radius: 40rpx 40rpx 40rpx 40rpx;
.scroll-view_H {
  white-space: nowrap;
  width: 100%;
}
.avtor{
    position: relative;
    .img {
      width: 68rpx;
      height: 68rpx;
      border-radius: 50%;
      margin-right: 20rpx;
    }
    .img2{
        width: 28rpx;
        height: 28rpx;
        border-radius: 50%; 
        position: absolute;
        bottom: 10rpx;
       right: 10rpx;
    }
}

}

</style>